xquery version "1.0";

import module namespace layout="http://www.example.com/layout" at "xmldb:exist:///db/projdb/modules/layout.xqm";
declare namespace pm = "http://www.politicalmashup.nl";
declare option exist:serialize "doctype-public=-//W3C//DTD&#160;XHTML&#160;1.1//EN
                                doctype-system=http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd";

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl">
    <head>
        <meta http-equiv="content-type" content="application/xhtml+xml;charset=utf-8" />
        <title>Activiteit in de plenaire vergaderingen</title>
        <link rel="stylesheet" style="text/css" href="style/core_layout.css"/>
		<script type="text/javascript" src="js/jquery.js"><!-- --></script>
        <script type="text/javascript" src="https://www.google.com/jsapi"><!-- --></script>
        <script type="text/javascript" src="js/activity.js"><!-- --></script>
        <script type="text/javascript" src="js/myScripts.js"><!-- --></script>
        <script type="text/javascript">
            //<![CDATA[
            google.load("visualization", "1", {packages:["corechart"]});
            google.setOnLoadCallback(function() {
                initShowHideButtons();

                activity_setUpdateFunction(function(xml) {
                    activity_loadRankingList(xml, "detailedList", false);
                    activity_loadTopList(xml, "detailedList", "mostActiveList", "leastActiveList");
                });

                activity_run();
            });
            //]]>
        </script>
        
        
    </head>
    <body>	
         <div class="containerBox">
         {layout:topMenu()}
 
        <div class="box" id="titleBox">
            <div class="margin">
                <h1>Ranking</h1>
            </div>
        </div>
        
        <div class="box" id="mostAndLeastActiveBox">
            <div class="margin">
                <h2 class="boxTitle hiddenElement">Overzicht</h2>
                <div class="columnspace twoColumns darkBackground">
                    <div class="column activityChart firstColumn">
                        <h3 class="columnTitle">Meest actief</h3>
                        <ol id="mostActiveList"><!-- //--></ol>
                    </div>
                    <div class="column activityChart secondColumn">
                        <h3 class="columnTitle">Minst actief</h3>
                        <ol id="leastActiveList"><!-- //--></ol>
                    </div>
                    <br class="clearer"/>
                </div>
            </div>
        </div>

        <div class="box" id="detailedListBox">
            <div class="margin">
                <h2 class="boxTitle">Volledige lijst</h2>
                <div class="boxDescription">
                <p>De ranking is gebaseerd op de activiteitsgraad, zoals geconfigureerd op de <a href="activity.xql">activiteits-pagina</a>.</p>
                </div>

                <div class="boxContent darkBackground hideByDefault">
                    <div class="legende">
                        <h3 class="contentTitle">Legende</h3>
                        <ul>
                            <li><span class="chairRole">Voorzitter</span></li>
                            <li><span class="mpRole">Volksvertegenwoordiger</span></li>
                            <li><span class="mayorRole">Burgemeester</span></li>
                            <li><span class="governmentRole">Regeringslid</span></li>
                        </ul>
                    </div>
                    <h3 class="contentTitle">Lijst</h3>
                    <ol id="detailedList"><!-- -->
                    </ol>
                </div>
            </div>
        </div>
        
</div>
    </body>
</html>
